import '../../../assets/js/extensionFn.js';
import { count } from '../../../assets/js/help.js';
import echarts from 'echarts';
export default {
  data() {
    return {
      searchParams: {},
      headerTitle: '', //头部标题
      isShowParkingSpaceChart: true, //剩余车位
      isShowParkingFlowChart: true, //车流量分析
      isShowParkingTimeChart: true, //停车时长分布
      //剩余车位图表数据
      residualParkingSpaceOption: {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross',
            label: {
              backgroundColor: '#6a7985'
            }
          }
        },
        legend: {
          top: '0',
          right: '10%',
          data: ['总车位', '临时车位', '固定车位']
        },
        dataZoom: {
          type: 'inside'
        },
        color: ['rgba(70, 137, 234, 0.62)', 'rgba(196, 146, 232, 0.62)', 'rgba(84, 124, 152, 0.62)'],
        grid: {
          top: '7%',
          show: false,
          height: 370
        },
        xAxis: [
          {
            name: '',
            nameLocation: 'end',
            type: 'category',
            boundaryGap: false,
            data: []
          }
        ],
        yAxis: [
          {
            name: '剩余车位',
            type: 'value'
          }
        ],
        series: [
          {
            name: '总车位',
            type: 'line',
            symbol: 'circle',
            areaStyle: {},
            // stack: '总量',
            data: []
          },
          {
            name: '临时车位',
            type: 'line',
            symbol: 'circle',
            areaStyle: {},
            // stack: '总量',
            data: []
          },
          {
            name: '固定车位',
            type: 'line',
            symbol: 'circle',
            areaStyle: {},
            // stack: '总量',
            data: []
          },
        ]
      },
      //车流量分析图表数据
      carFlowAnalysisOption: {
        backgroundColor: '#F4F4F4',
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        toolbox: {
          // feature: {
          //   magicType: { show: true, type: ['line', 'bar'] },
          //   restore: { show: true }
          // }
        },
        legend: {
          top: '7%',
          right: '10%',
          itemWidth: 15,
          itemHeight: 15,
          data: ['VIP进场', '临时车进场', 'VIP离场', '临时车离场']
        },
        dataZoom: {
          type: 'inside'
        },
        grid: {
          show: false
        },
        color: ['#3C4F63', '#6FABC1', '#636974', '#CEA295'],
        xAxis: [
          {
            name: '',
            nameLocation: 'end',
            type: 'category',
            data: []
          }
        ],
        yAxis: [
          {
            name: '车流量',
            type: 'value'
          }
        ],
        series: [
          {
            name: 'VIP进场',
            type: 'bar',
            symbol: 'circle',
            stack: 'VIP离场',
            data: [],
            markPoint: {
              data: [
                {
                  name: '最大值',
                  type: 'max'
                },
                // {
                //   name: '最小值',
                //   type: 'min'
                // }
              ]
            }
          },
          {
            name: '临时车进场',
            type: 'bar',
            symbol: 'circle',
            stack: 'VIP离场',
            data: [],
            markPoint: {
              data: [
                {
                  name: '最大值',
                  type: 'max'
                },
                // {
                //   name: '最小值',
                //   type: 'min'
                // }
              ]
            }
          },
          {
            name: 'VIP离场',
            type: 'bar',
            symbol: 'circle',
            stack: '临时车进场',
            data: [],
            markPoint: {
              data: [
                {
                  name: '最大值',
                  type: 'max'
                },
                // {
                //   name: '最小值',
                //   type: 'min'
                // }
              ]
            }
          },
          {
            name: '临时车离场',
            type: 'bar',
            symbol: 'circle',
            stack: '临时车进场',
            data: [],
            markPoint: {
              data: [
                {
                  name: '最大值',
                  type: 'max'
                },
                // {
                //   name: '最小值',
                //   type: 'min'
                // }
              ]
            }
          }
        ]
      },
      //停车时长分布图表数据
      parkingTimeOption: {
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow'
          }
        },
        legend: {
          top: '7%',
          right: '10%',
          itemWidth: 15,
          itemHeight: 15,
          data: ['临时车', 'VIP车辆']
        },
        dataZoom: {
          type: 'inside'
        },
        grid: {
          show: false
        },
        color: ['#385484', '#6EB3DC'],
        xAxis: [
          {
            name: '时间',
            nameLocation: 'end',
            type: 'category',
            axisLabel: {
              interval: 0,
              rotate: 40
            },
            data: ['0-5min', '5-15min', '15-30min', '30min-1h', '1h-2h', '2h-3h', '3h-4h', '4h-5h', '5h-6h', '6h-12h', '12h-24h', '24h-2d', '2d-3d', '3d-4d', '4d-5d', '5d-6d', '6d-7d', '7d以上']
          }
        ],
        yAxis: [
          {
            name: '车辆数',
            type: 'value'
          }
        ],
        series: [
          {
            name: '临时车',
            type: 'bar',
            symbol: 'circle',
            stack: 'VIP车辆',
            data: []
          },
          {
            name: 'VIP车辆',
            type: 'bar',
            symbol: 'circle',
            stack: 'VIP车辆',
            data: []
          }
        ]
      },
      //剩余车位数热力图表数据
      residualParkingSpaceHotChartOption: {
        tooltip: {
          position: 'top'
        },
        animation: false,
        grid: {
          height: '50%',
          y: '10%'
        },
        xAxis: {
          type: 'category',
          data: [],
          splitArea: {
              show: true
          }
        },
        yAxis: {
          type: 'category',
          splitArea: {
              show: true
          }
        },
        visualMap: {
          min: 0,
          max: 10,
          calculable: true,
          orient: 'horizontal',
          left: 'center',
          bottom: '15%'
        },
        series: [{
          name: 'Punch Card',
          type: 'heatmap',
          data: [],
          label: {
            normal: {
              show: true
            }
          },
          itemStyle: {
            emphasis: {
              shadowBlur: 10,
              shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
          }
        }]
      },
      option: {
        tooltip: {
          position: 'right',
        },
        toolbox: {
          show: true,
          right: '10%',
          top: '1%',
          feature: {
            saveAsImage: {
              show: true
            }
          }
        },
        animation: false,
        grid: {
          show: false,
          height: '340'
        },
        xAxis: {
          name: "时间",
          nameLocation: 'end',
          type: 'category',
          data: ["0:00","0:10","0:20","0:30","0:40","0:50","1:00","1:10","1:20","1:30","1:40","1:50","2:00","2:10","2:20","2:30","2:40","2:50","3:00","3:10","3:20","3:30","3:40","3:50","4:00","4:10","4:20","4:30","4:40","4:50","5:00","5:10","5:20","5:30","5:40","5:50","6:00","6:10","6:20","6:30","6:40","6:50","7:00","7:10","7:20","7:30","7:40","7:50","8:00","8:10","8:20","8:30","8:40","8:50","9:00","9:10","9:20","9:30","9:40","9:50","10:00","10:10","10:20","10:30","10:40","10:50","11:00","11:10","11:20","11:30","11:40","11:50","12:00","12:10","12:20","12:30","12:40","12:50","13:00","13:10","13:20","13:30","13:40","13:50","14:00","14:10","14:20","14:30","14:40","14:50","15:00","15:10","15:20","15:30","15:40","15:50","16:00","16:10","16:20","16:30","16:40","16:50","17:00","17:10","17:20","17:30","17:40","17:50","18:00","18:10","18:20","18:30","18:40","18:50","19:00","19:10","19:20","19:30","19:40","19:50","20:00","20:10","20:20","20:30","20:40","20:50","21:00","21:10","21:20","21:30","21:40","21:50","22:00","22:10","22:20","22:30","22:40","22:50","23:00","23:10","23:20","23:30","23:40","23:50"],
          splitArea: {
            show: true
          },
          axisTick: {
            interval: 11
          },
          axisLabel: {
            interval: 11
          },
          // visualMap: false,
        },
        yAxis: {
          name: "日期",
          nameLocation: 'end',
          type: 'category',
          data: [],
          splitArea: {
            show: true
          },
          axisLabel: {
            interval: 0
          },
          axisTick: {
            interval: 0
          }
        },
        visualMap: {
          type: 'continuous',
          min: 0,
          max: 100,
          text: ['高', '低'],
          realtime: false,
          calculable: true,
          hoverLink: true,
          inRange: {
            color: ['#0aa07e', '#1fbd47', '#30d41b', '#8cfe01', '#fef800', '#ff0000'],
          },
          x: 'right',
          y: 'top',
        },
        series: [{
          name: '使用率',
          type: 'heatmap',
          data: [],
          label: {
            normal: {
              show: false
            }
          },
          itemStyle: {
            emphasis: {
              shadowBlur: 10,
              shadowColor: 'rgba(0, 0, 0, 0.5)'
            }
          }
        }]
      },
      residualParkingSpaceEchart: '', //剩余车位obj
      carFlowAnalysisEchart: '', //车流量分析obj
      parkingTimeEchart: '', //停车时长分布obj
      //顶部的统计数据
      topSummaryData: {
        freeCarports: 0, //免费车位
        tempCarports: 0, //临时车位
        slotsNumber: 0, //总车位
        leasedCarports: 0, //租用车位
        bookedCarports: 0, //预定车位
        fixedCarports: 0 //固定车位
      },
      //车牌Top10
      carCodeList: [],
      // 车牌号码Top10
      carNoTopTenList: [],
      //累计进场车辆数
      enterTotalCount: '',
      //累计离场车辆数
      leaveTotalCount: '',
      //累计进场车辆数(08:00-09:00)
      enterMaxValue: '',
      //离场车辆高峰值(17:00-18:00)
      leaveMaxValue: '',
      //累计进场车辆数峰值时间段
      enterMaxValueTimeSlot: '',
      //离场车辆高峰值时间段
      leaveMaxValueTimeSlot: '',
      //最多停车时长分布值
      parkingDurationMaxValue: '',
      //最少停车时长分布值
      parkingDurationMinValue: '',
      //最多停车时长分布值时间段
      parkingDurationMaxValueTimeSlot: '',
      //最少停车时长分布值时间段
      parkingDurationMinValueTimeSlot: '',
      //通道列表
      passagewayList: [],
      //选择的通道
      passagewaySelected: '全部通道',
      //通道列表数据(网络)
      passagewayListData: {},
      //所有通道数据(网络)
      carFlowAnalysisOptionAllData: []
    };
  },
  created() {
    this.queryAllPark();
  },
  mounted() {
    this.residualParkingSpaceEchart = echarts.init(document.getElementById('charts-parkingTime'));
    this.carFlowAnalysisEchart = echarts.init(document.getElementById('charts-flow'));
    this.parkingTimeEchart = echarts.init(document.getElementById('charts-parking-time'));
    this.renderResidualParkingSpace();
    this.renderCarFlowAnalysis();
    this.renderParkingTime();
  },
  methods: {
    disabledDate(time) {
      return time.getTime() >= new Date().getTime(); //今天日期可以选
      // return time.getTime() > Date.now() - 8.64e7; //今天日期不可选
    },
    initData(){
      let reportDimension = this.searchList[0].value, date = this.searchList[1].value
      let dateStr = ''
      let yearStr = date.getFullYear() 
      let monthStr = date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1;
      let dayStr = date.getDate() < 10 ? '0'+date.getDate() : date.getDate();
      if(reportDimension=='day'){
        dateStr = yearStr+'-'+monthStr+'-'+dayStr
      }else if(reportDimension=='month'){
        dateStr = yearStr+'-'+monthStr+'-01'
      }
      this.searchParams.statDate = dateStr
      this.searchParams.reportDimension = reportDimension
      let aparams = {
        statDate: dateStr,
        parkId: '',
        reportDimension: reportDimension
      }
      this.confirmSearch(aparams)
    },
    //重新生成
    reBuild(){
      let url = '',reportDimension = this.searchList[0].value, date = this.searchList[1].value
      let dateStr = ''
      let yearStr = date.getFullYear() 
      let monthStr = date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1;
      let dayStr = date.getDate() < 10 ? '0'+date.getDate() : date.getDate();
      if(reportDimension=='day'){
        url = '/park/merchant_park_analyse/createDayReportByManual.do'
        dateStr = yearStr+'-'+monthStr+'-'+dayStr
      }else if(reportDimension=='month'){
        url = '/park/merchant_park_analyse/createMonthReportByManual.do'
        dateStr = yearStr+'-'+monthStr+'-01'
      }
      let params = {
        parkId: this.searchList[2].value,
        date: dateStr
      }
      API.fetchGet(url,params).then(res=>{
        if(res.status==1){
          if(reportDimension=='month'){
            dateStr = yearStr+'-'+monthStr
          }
          this.searchParams.parkId =  params.parkId
          this.searchParams.statDate = dateStr
          this.searchParams.reportDimension = reportDimension
          let aparams = {
            statDate: dateStr,
            parkId: params.parkId,
            reportDimension: reportDimension
          }
          this.confirmSearch(aparams)
        }
      },err=>{})
    },
    //渲染--剩余车位数表
    renderResidualParkingSpace() {
      let _this = this;
      _this.residualParkingSpaceEchart.showLoading();
      if(_this.searchParams.reportDimension == 'month') {
        _this.residualParkingSpaceEchart.setOption(_this.option);
      }else{
        _this.residualParkingSpaceEchart.setOption(_this.residualParkingSpaceOption);
      }
      _this.residualParkingSpaceEchart.hideLoading();
    },
    //渲染--车流量分析表
    renderCarFlowAnalysis() {
      let _this = this;
      _this.carFlowAnalysisEchart.showLoading();
      _this.carFlowAnalysisEchart.setOption(_this.carFlowAnalysisOption);
      _this.carFlowAnalysisEchart.hideLoading();
    },
    //渲染--停车时长分布表
    renderParkingTime() {
      let _this = this;
      _this.parkingTimeEchart.showLoading();
      _this.parkingTimeEchart.setOption(_this.parkingTimeOption);
      _this.parkingTimeEchart.hideLoading();
    },
    choosePassageway(val) {
      let arrList = this.passagewayListData[val];
      if (arrList == undefined || arrList == null) {
        this.carFlowAnalysisOption.series[0].data = this.carFlowAnalysisOptionAllData[0];
        this.carFlowAnalysisOption.series[1].data = this.carFlowAnalysisOptionAllData[1];
        this.carFlowAnalysisOption.series[2].data = this.carFlowAnalysisOptionAllData[2];
        this.carFlowAnalysisOption.series[3].data = this.carFlowAnalysisOptionAllData[3];
      } else {
        let tempEnterArr = [],
          tempLeaveArr = [],
          vipEnterArr = [],
          vipLeaveArr = [];
        tempEnterArr.push(0), tempLeaveArr.push(0), vipEnterArr.push(0), vipLeaveArr.push(0);
        for (let i = 0; i < arrList.length; i++) {
          let obj = arrList[i];
          tempEnterArr.push(obj.tempEnter);
          tempLeaveArr.push(obj.tempLeave);
          vipEnterArr.push(obj.vipEnter);
          vipLeaveArr.push(obj.vipLeave);
        }
        this.carFlowAnalysisOption.series[0].data = vipEnterArr;
        this.carFlowAnalysisOption.series[1].data = tempEnterArr;
        this.carFlowAnalysisOption.series[2].data = vipLeaveArr;
        this.carFlowAnalysisOption.series[3].data = tempLeaveArr;
      }
      echarts.dispose(this.carFlowAnalysisEchart);
      this.carFlowAnalysisEchart = echarts.init(document.getElementById('charts-flow'));
      this.renderCarFlowAnalysis();
    },
    getParkingData() {
      let self = this;
      let url = '/park/merchant_park_analyse/queryPark.do';
      API.fetchGet(url, { parkId: this.searchParams.parkId }).then(
        res => {
          let data = res.data;
          if (data && count(data) > 0) {
            self.topSummaryData.tempCarports = data.tempCarports ? data.tempCarports : 0; //临时车位
            self.topSummaryData.slotsNumber = data.slotsNumber ? data.slotsNumber : 0; //总车位
            self.topSummaryData.fixedCarports = self.topSummaryData.slotsNumber - self.topSummaryData.tempCarports; //固定车位
          }
        },
        err => {}
      );
    },
    queryAllPark() {
      let index = this.searchList.findByKey('index', 2);
      let url = '/commonFun/queryAllPark.do';
      API.fetchGet(url, {}).then(
        res => {
          let data = res.data;
          let list = data && data.parkList ? data.parkList : [];

          let parkList = [];
          list &&
            list.forEach(item => {
              let obj = {
                name: item.name,
                value: item.id
              };
              parkList.push(obj);
            });
          this.searchList[index].options = parkList;
          this.searchList[index].value = parkList[0].value || '';
          this.initData()
        },
        err => {}
      );
    },
    clearElement(id) {
      let $Parent = $('#' + id).parent();
      $('#' + id).remove();
      $Parent.append('<div id="' + id + '" class="' + id + '"></div>');
    },
    //剩余车位
    getResidualParkingSpace() {
      let url = '';
      let params = {
        dimension: this.searchParams.reportDimension,
        parkId: this.searchParams.parkId,
        type: 'total'
      };
      if (this.searchParams.reportDimension == 'day') {
        url = '/park/parkingStatistic/dayStatistic.do';
        params.format = 'YYYY-MM-DD';
        params.date = this.searchParams.statDate;
      } else if (this.searchParams.reportDimension == 'month') {
        url = '/park/parkingStatistic/monthStatistic.do';
        params.format = 'YYYY-MM';
        params.yearMonth = this.searchParams.statDate;
      }
      this.headerTitle = '';
      this.residualParkingSpaceOption.xAxis[0].name = '';
      this.residualParkingSpaceOption.xAxis[0].data = [];
      for (let i = 0; i < 3; i++) {
        this.residualParkingSpaceOption.series[i].data = [];
      }
      API.fetchGet(url, params).then(res => {
        let data = res.data;
        this.headerTitle = data.title;
        let list = data && data.dataList ? data.dataList : [];
        if (!data || list.length === 0) {
          
        }else{

          if (this.searchParams.reportDimension == 'day') {
            this.residualParkingSpaceOption.xAxis[0].name = '时间';
            this.residualParkingSpaceOption.xAxis[0].data = [
              '0:00',
              '1:00',
              '2:00',
              '3:00',
              '4:00',
              '5:00',
              '6:00',
              '7:00',
              '8:00',
              '9:00',
              '10:00',
              '11:00',
              '12:00',
              '13:00',
              '14:00',
              '15:00',
              '16:00',
              '17:00',
              '18:00',
              '19:00',
              '20:00',
              '21:00',
              '22:00',
              '23:00',
              '24:00'
            ];
          } else if (this.searchParams.reportDimension == 'month') {
            this.residualParkingSpaceOption.xAxis[0].name = '日期';
            let dateArr = [];
            for (let i = 0; i <= data.days; i++) {
              dateArr.push(i + '日');
            }
            this.option.yAxis.data = dateArr;
          }
          if (this.searchParams.reportDimension == 'month') {
            this.option.series[0].data = list
          } else if (this.searchParams.reportDimension == 'day') {
            for (let i = 0; i < 3; i++) {
              let item = list[i];
              let objData = [];
              objData[0] = '0';
              for (let k = 1; k <= 24; k++) {
                let j = k * 60 - 1;
                objData[k] = item.data[j] == '-' ? 0 : item.data[j];
              }
              this.residualParkingSpaceOption.series[i].data = objData;
            }
          }
      }
      echarts.dispose(this.residualParkingSpaceEchart);
      this.residualParkingSpaceEchart = echarts.init(document.getElementById('charts-parkingTime'));
      this.renderResidualParkingSpace();
      });
    },
    //车流量
    getCarFlowAnalysis(carFlowInfo) {
      this.carFlowAnalysisOption.xAxis[0].name = '';
      this.carFlowAnalysisOption.xAxis[0].data = [];
      for (let i = 0; i < 4; i++) {
        this.carFlowAnalysisOption.series[i].data = [];
      }
      let carFlowInfoObj = carFlowInfo != null && carFlowInfo != '' ? JSON.parse(carFlowInfo) : {};
      this.passagewayListData = carFlowInfoObj;
      this.carFlowAnalysisOptionAllData = [];
      let passagewayListArr = [];
      passagewayListArr.push('全部通道');
      Object.keys(carFlowInfoObj).forEach(function(key) {
        passagewayListArr.push(key);
      });
      this.passagewayList = passagewayListArr;
      if (this.searchParams.reportDimension == 'day') {
        this.carFlowAnalysisOption.xAxis[0].name = '时间';
        this.carFlowAnalysisOption.xAxis[0].data = [
          '0:00',
          '1:00',
          '2:00',
          '3:00',
          '4:00',
          '5:00',
          '6:00',
          '7:00',
          '8:00',
          '9:00',
          '10:00',
          '11:00',
          '12:00',
          '13:00',
          '14:00',
          '15:00',
          '16:00',
          '17:00',
          '18:00',
          '19:00',
          '20:00',
          '21:00',
          '22:00',
          '23:00',
          '24:00'
        ];
        for (let i = 0; i < 4; i++) {
          let tempArr = [];
          tempArr[0] = 0;
          for (let j = 0; j < 24; j++) {
            let sum = 0;
            Object.keys(carFlowInfoObj).forEach(function(key) {
              let list = carFlowInfoObj[key];
              if (i == 0) {
                sum += list[j].vipEnter; //vip进场
              } else if (i == 1) {
                sum += list[j].tempEnter; //临时车进场
              } else if (i == 2) {
                sum += list[j].vipLeave; //vip离场
              } else if (i == 3) {
                sum += list[j].tempLeave; //临时车离场
              }
            });
            tempArr[j + 1] = sum;
          }
          this.carFlowAnalysisOptionAllData[i] = tempArr;
          this.carFlowAnalysisOption.series[i].data = tempArr;
        }
      } else if (this.searchParams.reportDimension == 'month') {
        this.carFlowAnalysisOption.xAxis[0].name = '日期';
        let dateArr = [];
        dateArr.push('0');
        let monthDays = this.getMonthDays(this.searchParams.statDate);
        for (let i = 1; i <= monthDays; i++) {
          dateArr.push(i + '日');
        }
        this.carFlowAnalysisOption.xAxis[0].data = dateArr;
        for (let i = 0; i < 4; i++) {
          let tempArr = [];
          tempArr[0] = 0;
          for (let j = 0; j < monthDays; j++) {
            let sum = 0;
            Object.keys(carFlowInfoObj).forEach(function(key) {
              let list = carFlowInfoObj[key];
              if (i == 0) {
                sum += list[j].vipEnter; //vip进场
              } else if (i == 1) {
                sum += list[j].tempEnter; //临时车进场
              } else if (i == 2) {
                sum += list[j].vipLeave; //vip离场
              } else if (i == 3) {
                sum += list[j].tempLeave; //临时车离场
              }
            });
            tempArr[j + 1] = sum;
          }
          this.carFlowAnalysisOptionAllData[i] = tempArr;
          this.carFlowAnalysisOption.series[i].data = tempArr;
        }
      }
      this.countCarFlowAnalysisData();
      this.renderCarFlowAnalysis();
    },
    //获取停车时长分布数据
    getParkingTimeSpread() {
      let url = '/park/merchant_park_analyse/getParkingAnalysisReport.do';
      let params = {
        parkId: this.searchParams.parkId
      };
      if (this.searchParams.reportDimension == 'day') {
        params.date = this.searchParams.statDate;
        params.reportDim = '0';
      } else if (this.searchParams.reportDimension == 'month') {
        params.date = this.searchParams.statDate + '-01';
        params.reportDim = '1';
      }
      for (let i = 0; i < 2; i++) {
        this.parkingTimeOption.series[i].data = [];
      }
      API.fetchGet(url, params).then(res => {
        let data = res.data;
        this.carCodeList = data.enterCarCodeAreaTopTen != null && data.enterCarCodeAreaTopTen != '' ? JSON.parse(data.enterCarCodeAreaTopTen) : [];
        this.carNoTopTenList = data.enterCarCodeTopTen != null && data.enterCarCodeTopTen != '' ? JSON.parse(data.enterCarCodeTopTen) : [];
        for (let i = this.carCodeList.length; i < 10; i++) {
          let obj = {};
          obj.carCodeArea = '';
          obj.count = '';
          this.carCodeList.push(obj);
        }
        for (let i = this.carNoTopTenList.length; i < 10; i++) {
          let obj = {};
          obj.carCodeArea = '';
          obj.count = '';
          this.carNoTopTenList.push(obj);
        }
        this.carNoTopTab = 1;
        this.getCarFlowAnalysis(data.carFlowInfo); //车流量
        //停车时长分布--计算y轴数据
        let parkingDurationInfo = data.parkingDurationInfo != null && data.parkingDurationInfo != '' ? JSON.parse(data.parkingDurationInfo) : [];
        
        this.calculateParkingTimeSpreadYaxis(parkingDurationInfo);
      });
    },
    // 统计车流量分析图表数据
    countCarFlowAnalysisData() {
      let dyadicArray = [];
      if (this.searchParams.reportDimension == 'day') {
        //日报
        for (let i = 0; i < 4; i++) {
          let tempArr = this.carFlowAnalysisOption.series[i].data;
          if (!tempArr || tempArr.length == 0) {
            dyadicArray.push([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]);
          } else {
            dyadicArray.push(tempArr);
          }
        }
        let enterCountArr = [],
          leaveCountArr = [];
        let enterMaxValue = 0,
          leaveMaxValue = 0,
          enterSum = 0,
          leaveSum = 0,
          enterMaxValueIndex = 0,
          leaveMaxValueIndex = 0;
        for (let k = 0; k < dyadicArray[0].length; k++) {
          enterCountArr[k] = dyadicArray[0][k] + dyadicArray[1][k];
          leaveCountArr[k] = dyadicArray[2][k] + dyadicArray[3][k];
          enterSum += enterCountArr[k]; //累计进场车辆
          leaveSum += leaveCountArr[k]; //累计离场车辆
          //进场车辆高峰值
          enterMaxValueIndex = enterCountArr[k] > enterMaxValue ? k : enterMaxValueIndex;
          enterMaxValue = enterCountArr[k] > enterMaxValue ? enterCountArr[k] : enterMaxValue;
          //离场车辆高峰值
          leaveMaxValueIndex = leaveCountArr[k] > leaveMaxValue ? k : leaveMaxValueIndex;
          leaveMaxValue = leaveCountArr[k] > leaveMaxValue ? leaveCountArr[k] : leaveMaxValue;
        }
        this.enterTotalCount = enterSum; //累计进场车辆
        this.leaveTotalCount = leaveSum; //累计离场车辆
        this.enterMaxValue = enterMaxValue; //进场车辆高峰值
        this.leaveMaxValue = leaveMaxValue; //离场车辆高峰值
        //进场车辆高峰值时间段
        if (enterMaxValueIndex == 0 || enterMaxValueIndex == 24) {
          this.enterMaxValueTimeSlot = '23:00-24:00';
        } else {
          this.enterMaxValueTimeSlot = enterMaxValueIndex - 1 + ':00-' + enterMaxValueIndex + ':00';
        }
        //离场车辆高峰值时间段
        if (leaveMaxValueIndex == 0 || leaveMaxValueIndex == 24) {
          this.leaveMaxValueTimeSlot = '23:00-24:00';
        } else {
          this.leaveMaxValueTimeSlot = leaveMaxValueIndex - 1 + ':00-' + leaveMaxValueIndex + ':00';
        }
      } else if (this.searchParams.reportDimension == 'month') {
        //月报
        let monthDays = this.getMonthDays(this.searchParams.statDate); //月份天数
        for (let i = 0; i < 4; i++) {
          let tempArr = this.carFlowAnalysisOption.series[i].data;
          if (!tempArr || tempArr.length == 0) {
            let monthDaysArr = [];
            for (let j = 0; j <= monthDays; j++) {
              monthDaysArr[j] = 0;
            }
            dyadicArray.push(monthDaysArr);
          } else {
            dyadicArray.push(tempArr);
          }
        }
        let enterCountArr = [],
          leaveCountArr = [];
        let enterMaxValue = 0,
          leaveMaxValue = 0,
          enterSum = 0,
          leaveSum = 0,
          enterMaxValueIndex = 0,
          leaveMaxValueIndex = 0;
        for (let k = 0; k < dyadicArray[0].length; k++) {
          enterCountArr[k] = dyadicArray[0][k] + dyadicArray[1][k];
          leaveCountArr[k] = dyadicArray[2][k] + dyadicArray[3][k];
          enterSum += enterCountArr[k]; //累计进场车辆
          leaveSum += leaveCountArr[k]; //累计离场车辆
          //进场车辆高峰值
          enterMaxValueIndex = enterCountArr[k] > enterMaxValue ? k : enterMaxValueIndex;
          enterMaxValue = enterCountArr[k] > enterMaxValue ? enterCountArr[k] : enterMaxValue;
          //离场车辆高峰值
          leaveMaxValueIndex = leaveCountArr[k] > leaveMaxValue ? k : leaveMaxValueIndex;
          leaveMaxValue = leaveCountArr[k] > leaveMaxValue ? leaveCountArr[k] : leaveMaxValue;
        }
        this.enterTotalCount = enterSum; //累计进场车辆
        this.leaveTotalCount = leaveSum; //累计离场车辆
        this.enterMaxValue = enterMaxValue; //进场车辆高峰值
        this.leaveMaxValue = leaveMaxValue; //离场车辆高峰值
        //进场车辆高峰值时间段
        if (enterMaxValueIndex == 0) {
          this.enterMaxValueTimeSlot = monthDays + '日';
        } else {
          this.enterMaxValueTimeSlot = enterMaxValueIndex + '日';
        }
        //离场车辆高峰值时间段
        if (leaveMaxValueIndex == 0) {
          this.leaveMaxValueTimeSlot = monthDays + '日';
        } else {
          this.leaveMaxValueTimeSlot = leaveMaxValueIndex + '日';
        }
      }
    },
    //计算停车时长分布图表数据
    calculateParkingTimeSpreadYaxis(parkingDurationInfo) {
      let tempCountArr = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
        vipCountArr = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
      for (let i = 0; i < parkingDurationInfo.length; i++) {
        let obj = parkingDurationInfo[i];
        let minute = obj.num * 5;
        if (minute >= 0 && minute <= 5) {
          tempCountArr[0] += obj.tempCount;
          vipCountArr[0] += obj.vipCount;
        } else if (minute > 5 && minute <= 15) {
          tempCountArr[1] += obj.tempCount;
          vipCountArr[1] += obj.vipCount;
        } else if (minute > 15 && minute <= 30) {
          tempCountArr[2] += obj.tempCount;
          vipCountArr[2] += obj.vipCount;
        } else if (minute > 30 && minute <= 60) {
          tempCountArr[3] += obj.tempCount;
          vipCountArr[3] += obj.vipCount;
        } else if (minute > 60 && minute <= 1440) {
          let h = parseInt(minute / 60);
          if (h >= 1 && h < 2) {
            tempCountArr[4] += obj.tempCount;
            vipCountArr[4] += obj.vipCount;
          } else if (h >= 2 && h < 3) {
            tempCountArr[5] += obj.tempCount;
            vipCountArr[5] += obj.vipCount;
          } else if (h >= 3 && h < 4) {
            tempCountArr[6] += obj.tempCount;
            vipCountArr[6] += obj.vipCount;
          } else if (h >= 4 && h < 5) {
            tempCountArr[7] += obj.tempCount;
            vipCountArr[7] += obj.vipCount;
          } else if (h >= 5 && h < 6) {
            tempCountArr[8] += obj.tempCount;
            vipCountArr[8] += obj.vipCount;
          } else if (h >= 6 && h < 12) {
            tempCountArr[9] += obj.tempCount;
            vipCountArr[9] += obj.vipCount;
          } else if (h >= 12 && h < 24) {
            tempCountArr[10] += obj.tempCount;
            vipCountArr[10] += obj.vipCount;
          }
        } else {
          let d = parseInt(parseInt(minute / 60) / 24);
          if (d >= 1 && d < 2) {
            tempCountArr[11] += obj.tempCount;
            vipCountArr[11] += obj.vipCount;
          } else if (d >= 2 && d < 3) {
            tempCountArr[12] += obj.tempCount;
            vipCountArr[12] += obj.vipCount;
          } else if (d >= 3 && d < 4) {
            tempCountArr[13] += obj.tempCount;
            vipCountArr[13] += obj.vipCount;
          } else if (d >= 4 && d < 5) {
            tempCountArr[14] += obj.tempCount;
            vipCountArr[14] += obj.vipCount;
          } else if (d >= 5 && d < 6) {
            tempCountArr[15] += obj.tempCount;
            vipCountArr[15] += obj.vipCount;
          } else if (d >= 6 && d < 7) {
            tempCountArr[16] += obj.tempCount;
            vipCountArr[16] += obj.vipCount;
          } else {
            tempCountArr[17] += obj.tempCount;
            vipCountArr[17] += obj.vipCount;
          }
        }
      }
      this.parkingTimeOption.series[0].data = tempCountArr;
      this.parkingTimeOption.series[1].data = vipCountArr;
      this.renderParkingTime();
      this.countParkingTimeSpreadData();
    },
    //统计停车时长分布图表数据
    countParkingTimeSpreadData() {
      let tempArr = this.parkingTimeOption.series[0].data,
        vipArr = this.parkingTimeOption.series[1].data;
      let sumArr = [];
      for (let i = 0; i < tempArr.length; i++) {
        sumArr[i] = tempArr[i] + vipArr[i];
      }
      let maxVal = 0,
        minVal = sumArr[0];
      let maxValIndex = 0,
        minValIndex = 0;
      for (let i = 0; i < sumArr.length; i++) {
        maxValIndex = sumArr[i] > maxVal ? i : maxValIndex;
        maxVal = sumArr[i] > maxVal ? sumArr[i] : maxVal;
        minValIndex = sumArr[i] < minVal ? i : minValIndex;
        minVal = sumArr[i] < minVal ? sumArr[i] : minVal;
      }
      this.parkingDurationMaxValue = maxVal;
      this.parkingDurationMinValue = minVal;
      this.parkingDurationMaxValueTimeSlot = this.parkingTimeOption.xAxis[0].data[maxValIndex];
      this.parkingDurationMinValueTimeSlot = this.parkingTimeOption.xAxis[0].data[minValIndex];
    },
    confirmSearch(params) {
      if (!params.parkId) {
        this.searchParams.parkId = this.searchList[2].options.length ? this.searchList[2].options[0].value : ''
        if(!this.searchParams.parkId){
          return;
        }
      }

      if (!params.statDate) {
        this.showToast('请选择时间', 2);
        return;
      }

      this.getParkingData();
      //剩余车位
      this.getResidualParkingSpace();
      //车流量 与 停车时长分布
      this.getParkingTimeSpread();
    },
    renderParkflowChart(chartData) {
      console.log(chartData);
      let flowChart = echarts.init(document.getElementById('charts-flow'));
      let option = {
        title: {
          text: '车流量分析',
          subtext: '次数',
          left: '10%'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow',
            label: {
              show: true
            }
          }
        },
        legend: {},
        toolbox: {
          show: true,
          feature: {
            // mark : {show: true},
            // dataView : {show: true, readOnly: false},
            magicType: { show: true, type: ['line', 'bar'] },
            restore: { show: true },
            saveAsImage: { show: true }
          }
        },
        // calculable: true,
        xAxis: {
          type: 'category',
          data: chartData.xAxis
        },
        yAxis: {
          type: 'value'
        },
        dataZoom: [
          {
            show: true,
            start: 0,
            end: 100
          },
          {
            type: 'inside',
            start: 0,
            end: 100
          },
          {
            show: true,
            yAxisIndex: 0,
            filterMode: 'empty',
            width: 30,
            height: '80%',
            showDataShadow: false,
            left: '93%'
          }
        ],
        series: [
          {
            name: '进场',
            data: chartData.yAxisIn,
            type: 'bar'
          },
          {
            name: '离场',
            data: chartData.yAxisOut,
            type: 'bar'
          }
        ]
      };

      flowChart.setOption(option);
      this.isShowParkingFlowChart = true;
    },
    renderParktimeChart(chartData) {
      console.log(chartData);
      let parktimeChart = echarts.init(document.getElementById('charts-parkingTime'));
      parktimeChart.showLoading();
      let option = {
        title: {
          text: '停车时长分布',
          subtext: '车辆',
          left: '10%'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'shadow',
            label: {
              show: true
            }
          }
        },
        toolbox: {
          show: true,
          feature: {
            // mark : {show: true},
            // dataView : {show: true, readOnly: false},
            magicType: { show: true, type: ['line', 'bar'] },
            restore: { show: true },
            saveAsImage: { show: true }
          }
        },
        calculable: true,
        xAxis: {
          type: 'category',
          data: chartData.xAxis,
          axisTick: {
            alignWithLabel: true
          }
        },
        yAxis: {
          type: 'value'
        },
        dataZoom: [
          {
            show: true,
            start: 0,
            end: 100
          },
          {
            type: 'inside',
            start: 0,
            end: 100
          },
          {
            show: true,
            yAxisIndex: 0,
            filterMode: 'empty',
            width: 30,
            height: '80%',
            showDataShadow: false,
            left: '93%'
          }
        ],
        series: [
          {
            data: chartData.yAxis,
            type: 'bar'
          }
        ]
      };

      parktimeChart.setOption(option);

      parktimeChart.hideLoading();
      this.isShowParkingSpaceChart = true;
    },
    renderMainChart() {
      //关系图--配置参数
      let rainfallOption = {
        title: {
          text: '雨量流量关系图',
          subtext: '数据来自西安兰特水电测控技术有限公司',
          x: 'center',
          align: 'right'
        },
        grid: {
          bottom: 80
        },
        toolbox: {
          feature: {
            dataZoom: {
              yAxisIndex: 'none'
            },
            restore: {},
            saveAsImage: {}
          }
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            type: 'cross',
            animation: false,
            label: {
              backgroundColor: '#505765'
            }
          }
        },
        legend: {
          data: ['流量', '降雨量'],
          x: 'left'
        },
        dataZoom: [
          {
            show: true,
            realtime: true,
            start: 65,
            end: 85
          },
          {
            type: 'inside',
            realtime: true,
            start: 65,
            end: 85
          }
        ],
        xAxis: [
          {
            type: 'category',
            boundaryGap: false,
            axisLine: { onZero: false },
            data: []
          }
        ],
        yAxis: [
          {
            name: '流量(m^3/s)',
            type: 'value',
            max: 500
          },
          {
            name: '降雨量(mm)',
            nameLocation: 'start',
            max: 5,
            type: 'value',
            inverse: true
          }
        ],
        series: [
          {
            name: '流量',
            type: 'line',
            animation: false,
            areaStyle: {},
            lineStyle: {
              width: 1
            },
            markArea: {
              silent: true,
              data: [
                [
                  {
                    xAxis: '2009/9/12\n7:00'
                  },
                  {
                    xAxis: '2009/9/22\n7:00'
                  }
                ]
              ]
            },
            data: []
          },
          {
            name: '降雨量',
            type: 'line',
            yAxisIndex: 1,
            animation: false,
            areaStyle: {},
            lineStyle: {
              width: 1
            },
            markArea: {
              silent: true,
              data: [
                [
                  {
                    xAxis: '2009/9/10\n7:00'
                  },
                  {
                    xAxis: '2009/9/20\n7:00'
                  }
                ]
              ]
            },
            data: []
          }
        ]
      };
      let rainfallChart = echarts.init(document.getElementById('main'));
    },
    handleSearchChange(item) {
      switch (item.name) {
        case 'reportDimension':
          this.changeReportDimension(item);
          break;
      }
    },
    changeReportDimension(item) {
      let value = item.value,
        ThisSearchItem = this.searchList[1];
      var today = new Date(
        moment()
          .subtract('days', 1)
          .format('YYYY-MM-DD')
      );
      var month = new Date(
        moment()
          .subtract('month', 1)
          .format('YYYY-MM')
      );
      var year = new Date(moment().format('YYYY'));
      switch (value) {
        case 'day':
          ThisSearchItem.style = {
            width: '185px'
          };
          ThisSearchItem.flag = 'date';
          ThisSearchItem.pickerType = 'date';
          ThisSearchItem.format = 'yyyy-MM-dd';
          ThisSearchItem.value = today;
          break;
        case 'month':
          ThisSearchItem.style = {
            width: '185px'
          };
          ThisSearchItem.flag = 'month';
          ThisSearchItem.pickerType = 'month';
          ThisSearchItem.format = 'yyyy-MM';
          ThisSearchItem.value = month;
          break;
        case 'year':
          ThisSearchItem.style = {
            width: '125px'
          };
          ThisSearchItem.flag = 'year';
          ThisSearchItem.pickerType = 'year';
          ThisSearchItem.format = 'yyyy';
          ThisSearchItem.value = year;
          break;
      }
    },
    /**
     * 初始化停车数据
     *
     */
    initParkingData() {},
    //获取一个月的天数
    getMonthDays(dateStr) {
      let date = new Date(dateStr);
      let year = date.getFullYear();
      let month = date.getMonth() + 1;
      let d = new Date(year, month, 0);
      return d.getDate();
    }
  }
};
